<template>
	<div class="m-25 mt-65">
		<div class="normal-box-mod">
			<div class="normal-box-hd clearfix">
				<div class="normal-box-title">
					<div class="decorate-square"></div>
					<h2>机器在线状态</h2>
				</div>
			</div>
			<Card style="margin-bottom: 10px;">
				<div class="normal-list-page-hd clearfix">

					<Col span="5" class="mr-10">
					<queryData @ProvinceData="childByValue" style="width: 400px"></queryData>
					</Col>
					机器编号:
					<Input class="mr-10" placeholder="请输入机器编号" v-model="queryData.code" style="width: 150px" />
					社区名称:
					<Input class="mr-10" placeholder="请输入地址" v-model="queryData.name" style="width: 150px" />
					机器类型：
					<Select class="mr-10" v-model="queryData.sbType" style="width:100px">
						<Option v-for="item in newSbType.sbType" :value="item.value" :key="item.value">{{ item.label }}</Option>
					</Select>
					<Button type="primary" custom-icon="iconfont icon-chaxun" size="small" @click='inQuire'>查询</Button>

				</div>
			</Card>
			<div class="normal-list-page-bd">
				<Table border :loading="list.loading" :columns="list.columns" :data="list.tableData"></Table>
			</div>
			<div class="normal-list-page-ft clearfix">
				<Page :total="queryData.totalRecord" :page-size="queryData.pageSize" :current="queryData.page" show-total
				 show-elevator @on-change="changePage"></Page>
			</div>
		</div>
	</div>
</template>
<script>
import gcDustbinApi from '@/api/ckMachineCenter/MCmanagement.js'
import moment from 'moment'
import {
  Message
} from 'iview'
import queryData from '@/view/test/cityTestZj.vue'

export default {
  name: 'lntegralSet',
  components: {
    queryData
  },
  data () {
    return {
      value: true,
      indeterminate: false,
      checkAll: false,
      newSbType: {
        cityCascade: {
          please: '',
          provid: [],
          cityid: [],
          distid: [],
          strt: [],
          commid: [],
          comminid: []
        },

        valueProvid: [],
        formMessage: [

        ],
        radiomessage: [{
          value: '1',
          label: '10进制'
        },
        {
          value: '2',
          label: '16进制'
        }
        ],
        provid: [

        ],
        sbType: [{
          value: '1',
          label: '发放机'

        },
        {
          value: '2',
          label: '分类箱'
        },
        {
          value: '3',
          label: '回收箱'
        },
        {
          value: '4',
          label: '测试/弃用'
        }
        ],
        redpacketFlag: [{
          value: '0',
          label: '村口积分'
        },
        {
          value: '1',
          label: '现金红包'
        }
        ]
      },

      // 列表
      list: {
        loading: false,
        selections: [],
        // 列表展示数据
        tableData: [],
        // 表格表头
        columns: [
          // 开始自动生成
          {
            title: '机器编号',
            key: 'code',
            align: 'center',
            minWidth: 100
          },
          {
            title: '机器类型',
            key: 'sbType',
            align: 'center',
            minWidth: 100
          },
          {
            title: '机器名称',
            key: 'linkname',
            align: 'center',
            minWidth: 100
          },
          {
            title: '社区名称',
            key: 'name',
            align: 'center',
            minWidth: 100
          },
          {
            title: '放置地址',
            key: 'address',
            align: 'center',
            minWidth: 200
          },
          {
            title: '门数',

            key: 'doorNum',
            align: 'center',
            minWidth: 100
          },
          {
            title: '1号门',

            key: 'doorFirstStatus',
            align: 'center',
            minWidth: 100
          },
          {
            title: '2号门',

            key: 'doorSecondStatus',
            align: 'center',
            minWidth: 100
          },
          {
            title: '3号门',

            key: 'doorThirdStatus',
            align: 'center',
            minWidth: 100
          },
          {
            title: '4号门',

            key: 'doorForthStatus',
            align: 'center',
            minWidth: 100
          }
        ]
      },
      // 页面查询数据
      queryData: {
        limit: 10,
        page: 1,
        totalRecord: 0

      }
    }
  },
  methods: {

    // 获取列表
    getTableData () {
      const that = this
      that.queryData.totalRecord = undefined
      gcDustbinApi.getStatus(that.queryData)
        .then(res => {
          let list = res.data.list
          // console.log(list)
          for (let i = 0; i < list.length; i++) {
            if (list[i].weightFlag == 0) {
              list[i].weightFlag = '无需计重'
            } else if (list[i].weightFlag == 1) {
              list[i].weightFlag = '计重'
            } else {

            }
            if (list[i].redpacketFlag == 0) {
              list[i].redpacketFlag = '村口积分'
            } else if (list[i].redpacketFlag == 1) {
              list[i].redpacketFlag = '现金红包'
            } else {

            }
            if (list[i].state == 2) {
              list[i].state = '16进制'
            } else if (list[i].state == 1) {
              list[i].state = '10进制'
            } else {

            }
            if (list[i].sbType == 1) {
              list[i].sbType = '发放机'
            } else if (list[i].sbType == 2) {
              list[i].sbType = '分类箱'
            } else if (list[i].sbType == 3) {
              list[i].sbType = '回收箱'
            } else if (list[i].sbType == 4) {
              list[i].sbType = '测试/弃用'
            } else {

            }
          }
          that.list.tableData = res.data.list
          that.queryData.totalRecord = res.data.totalRecord
          that.queryData.limit = res.data.pageSize
        })
        .catch(error => {
          Message.error(error)
        })
    },

    // 城市级联和表单级联
    childByValue (newObject) {
      this.queryData.provid = newObject.provid
      this.queryData.commid = newObject.commid
      this.queryData.cityid = newObject.cityid
      this.queryData.comminid = newObject.comminid
      this.queryData.distid = newObject.distid
      this.queryData.strt = newObject.strt
    },

    // 查询
    inQuire () {
      const that = this
      that.queryData.page = 1
			  that.getTableData()
    },

    // 每页显示记录数变更
    onPageSizeChange (pageSize) {
      this.queryData.limit = pageSize
      this.getTableData()
    },

    // 换页
    changePage (page) {
      this.queryData.page = page
      this.getTableData()
    }
  },

  created () {
    this.getTableData()
    // this.getProvince("1");
  }
}
</script>
